import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:loxen/mode/master/file_loxen.dart';
import 'package:loxen/routes/routes.dart';
import 'package:loxen/utils/config.dart';
import 'package:loxen/utils/image_url.dart';
import 'package:loxen/viewmode/file_list_viewmodel.dart';
import 'package:loxen/widget/loading_widget.dart';
import 'package:provider/provider.dart';

class MineStudyFileListWidget extends StatelessWidget {


  final String name;
  final String type;

  const MineStudyFileListWidget({Key key, this.name, this.type}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var data = context.select<FileListViewModel,List<FileLoxen>>((value)=>value.list);
    if(data == null)return LoadingWidget();
    ScrollController _scrollController = ScrollController();
    _scrollController.addListener(() {
      if(_scrollController.position.pixels == _scrollController.position.maxScrollExtent){
        context.read<FileListViewModel>().nextData();
      }
    });
    return Container(
      margin: EdgeInsets.only(
          top: 50.h, left: 35.w, right: 35.w),
      child: GridView.count(
        controller: _scrollController,
        crossAxisCount: 3,
        mainAxisSpacing: 20.w,
        crossAxisSpacing: 20.w,
        childAspectRatio: 0.75,
        children: data
            .map((entity) => _itemWidget(context,entity))
            .toList(),
      ),
    );
  }

  Widget _itemWidget(BuildContext context,FileLoxen entity) {
    return  Stack(
      alignment: Alignment.center,
      children: <Widget>[
        GestureDetector(
          onTap: () {
            Navigator.of(context).pushNamed(Routes.mineStudyFolder,arguments: [name,type,entity.id]);
          },
          child: Container(
            width: double.infinity,
            height: double.infinity,
            child: ClipRRect(
                borderRadius: BorderRadius.circular(15.w),
                child: entity.cover != ''
                    ? CachedNetworkImage(
                  imageUrl:  ImageUrlUtil.getClean(entity.cover),
                  placeholder: (_, __) => Constants.loadingIcon(),
                  fit: BoxFit.cover,
                )
                    : Center(
                  child: Image.asset(
                    'images/default_folder.png',
                    width: 57.w,
                    height: 49.w,
                  ),
                )),
            decoration: BoxDecoration(
                color: Color(0xFF0CB7D9),
                borderRadius: BorderRadius.all(Radius.circular(15.w))),
          ),
        ),
        Align(
          alignment: Alignment.bottomCenter,
          child: Container(
            height: 61.h,
            alignment: Alignment.center,
            decoration: BoxDecoration(
              color: Colors.black.withAlpha(30),
              borderRadius: BorderRadius.only(
                bottomLeft: Radius.circular(15.w),
                bottomRight: Radius.circular(15.w),
              ),
            ),
            child: Column(
              children: <Widget>[
                Padding(
                  padding: EdgeInsets.only(left: 25.w),
                  child: Row(
                    children: <Widget>[
                      Expanded(
                        child: Container(
                          child: Text(
                            entity.name,
                            style: TextStyle(
                                fontSize: 22.sp,
                                color: Theme.of(context)
                                    .textTheme
                                    .subtitle1
                                    .color,
                                fontWeight: FontWeight.w500),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
                Container(
                  padding: EdgeInsets.only(left: 25.w),
                  width: double.infinity,
                  child: Builder(builder: (context) {
                    var num = context.select<FileListViewModel, int>(
                            (value) => entity.num);
                    return Text(
                      '$num$name',
                      style: TextStyle(
                          fontSize: 18.sp,
                          color: Theme.of(context)
                              .primaryTextTheme
                              .subtitle1
                              .color),
                    );
                  }),
                )
              ],
            ),
          ),
        ),
      ],
    );
  }
}
